<template>
  <div class="drawer-content">
    <div class="theme-tab-container">
      <el-tabs  v-model="proceActiveName">
        <el-tab-pane label="流程属性" name="first">
          <el-form
            label-suffix="："
            label-width="90px"
            :model="ruleForm"
            ref="ruleForm"
            style="width: 95%"
          >
            <el-row>
              <el-col :span="12">
                <el-form-item label="流程Key" prop="key">
                  <el-input v-model="ruleForm.key" readonly></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="流程名称" prop="name">
                  <el-input v-model="ruleForm.name"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="所属类别" prop="flowSort">
                  <select-tree
                    class="tree"
                    v-model="ruleForm.sortid"
                    :data="sortdata"
                    placeholder="请选择所属类别"
                  ></select-tree>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="表单类型" prop="form_type">
                  <el-select v-model="ruleForm.form_type" @change="updateProceForm('form_type')">
                    <el-option label="内置表单" value="0" />
                    <el-option label="外部表单" value="1" />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item v-if="taskFormtype == '0'" prop="formMap" label="流程表单">
                  <el-select v-model="ruleForm.formMap" filterable @change="updateAttrs">
                    <el-option v-for="i in formMapList" :key="i.id" :value="i.id" :label="i.name" />
                  </el-select>
                </el-form-item>
                <el-form-item v-if="taskFormtype == '1'" prop="form_url" label="表单地址">
                  <el-input
                    v-model="ruleForm.form_url"
                    @change="updateElementTask('form_url')"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item v-if="taskFormtype == '0'" label="表单预览">
                  <div>
                    <div class="element-drawer__button">
                      <el-button size="mini" type="primary" icon="el-icon-view" @click="openView()"
                      >点击查看</el-button
                      >
                    </div>
                  </div>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="标题生成" prop="titleModel">
                  <el-input v-model="ruleForm.titleModel"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <div class="theme-main-container">
            <!-- 搜索 -->
            <div class="filter-container">
              <el-tabs v-model="subActiveName" type="card">
                <el-tab-pane label="参数设置" name="1">
                  <el-button
                    type="success"
                    icon="el-icon-plus"
                    @click="addtable"
                  >
                    添加
                  </el-button>
                  <el-button
                    type="warning"
                    icon="el-icon-share"
                    @click="qingchutable"
                  >
                    清空
                  </el-button>
                  <el-button
                    type="danger"
                    icon="el-icon-delete"
                    @click="deltable"
                  >
                    删除
                  </el-button>

                  <el-table
                    :data="proceParams"
                    class="table1"
                    @selection-change="handleDetailSelectionChange"
                    :row-class-name="rowClassName"
                    ref="proceParamsTable"
                  >
                    <el-table-column
                      type="selection"
                      width="30"
                      align="center"
                    />
                    <el-table-column
                      type="index"
                      label="序号"
                      width="50"
                    > </el-table-column>

                    <el-table-column
                      label="参数名称"
                    >
                      <template slot-scope="scope">
                        <el-input v-model="scope.row.paramKey"></el-input>
                      </template>
                    </el-table-column>

                    <el-table-column
                      label="参数类型"
                    >
                      <template slot-scope="scope">
                        <el-select
                          v-model="scope.row.paramType"
                        >
                          <el-option
                            v-for="item in paramTypes"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                          ></el-option>
                        </el-select>
                      </template>
                    </el-table-column>

                    <el-table-column
                      label="参数值类型"
                    >
                      <template slot-scope="scope">
                        <el-select
                          v-model="scope.row.valueType"
                        >
                          <el-option
                            v-for="item in paramValueTypes"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                          ></el-option>
                        </el-select>
                      </template>
                    </el-table-column>

                    <el-table-column
                      label="参数值"
                    >
                      <template slot-scope="scope">
                        <el-input v-model="scope.row.paramValue"></el-input>
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
                <el-tab-pane label="逾期设置" name="2">
                  <el-form
                    label-suffix="："
                    label-width="120px"
                    :model="ruleOverDue"
                    ref="ruleOverDue"
                    style="width: 95%"
                  >
                    <el-row>
                      <el-col :span="12">
                        <el-form-item label="生命周期(D)" prop="actionCycle">
                          <el-input v-model="ruleOverDue.actionCycle"
                                    @input.native="formatNumber('actionCycle','ruleOverDue')"
                                    @compositionend.native="formatNumber('actionCycle','ruleOverDue')"></el-input>
                        </el-form-item>
                      </el-col>
                      <el-col :span="12">
                        <el-form-item label="预警时间(H)" prop="beforeTime">
                          <el-input v-model="ruleOverDue.beforeTime"
                                    @input.native="formatNumber('beforeTime','ruleOverDue')"
                                    @compositionend.native="formatNumber('beforeTime','ruleOverDue')"></el-input>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <el-row>
                      <el-col :span="12">
                        <el-form-item label="逾期预警" prop="overDueWar">
                          <el-select
                            v-model="ruleOverDue.overDueWar"
                          >
                            <el-option
                              v-for="item in overDueWarnings"
                              :key="item.value"
                              :label="item.label"
                              :value="item.value"
                            ></el-option>
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <el-col :span="12">
                        <el-form-item v-if="ruleOverDue.overDueWar==2" label="预警接口" prop="overDueWarUrl">
                          <el-input v-model="ruleOverDue.overDueWarUrl"></el-input>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <el-row>
                      <el-col :span="12">
                        <el-form-item label="逾期处理" prop="overDueWay">
                          <el-select
                            v-model="ruleOverDue.overDueWay"
                          >
                            <el-option
                              v-for="item in overDueWays"
                              :key="item.value"
                              :label="item.label"
                              :value="item.value"
                            ></el-option>
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <el-col :span="12">
                        <el-form-item v-if="ruleOverDue.overDueWay==3" label="逾期接口" prop="overDueWayUrl">
                          <el-input v-model="ruleOverDue.overDueWayUrl"></el-input>
                        </el-form-item>
                      </el-col>
                    </el-row>
                  </el-form>
                </el-tab-pane>
                <el-tab-pane label="定时启动" name="3">
                  <el-form
                    label-suffix="："
                    label-width="120px"
                    :model="timedStart"
                    ref="timedStart"
                    style="width: 95%"
                  >
                    <el-row>
                      <el-col :span="12">
                        <el-form-item label="启动设置" prop="tstWay">
                          <el-select
                            v-model="timedStart.tstWay"
                          >
                            <el-option
                              v-for="item in timedStartWays"
                              :key="item.value"
                              :label="item.label"
                              :value="item.value"
                            ></el-option>
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <el-col :span="12">
                        <el-form-item v-if="timedStart.tstWay==1" label="参数说明">
                          <span style="color: darkorange">{"TstWay":"MM(每月) or WK(每周) or DD(每天)","Remarks":"每月几号或每周几，每天为0","Timed":[{"hh":"8:30"},{"hh":"10:30"}]}</span>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <el-row>
                      <el-col :span="24">
                        <el-form-item v-if="timedStart.tstWay==1" label="启动参数" prop="tstDoc">
                          <el-input v-model="timedStart.tstDoc"></el-input>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <el-row>
                      <el-col :span="24">
                        <el-form-item v-if="timedStart.tstWay==1" label="接收人员sql" prop="userSql">
                          <el-input v-model="timedStart.userSql"></el-input>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <el-row>
                      <el-col :span="24">
                        <el-form-item v-if="timedStart.tstWay==1" label="sql格式" >
                          <el-tag size="success">select username from sys_user</el-tag>
                        </el-form-item>
                      </el-col>
                    </el-row>
                  </el-form>
                </el-tab-pane>
                <el-tab-pane label="事件管理" name="4">

                  <el-table
                    :data="eventClass"
                    class="table1"
                    ref="eventClassParamsTable"
                  >
                    <el-table-column
                      type="index"
                      label="序号"
                      width="50"
                    > </el-table-column>

                    <el-table-column
                      label="事件类型"
                    >
                      <template slot-scope="scope">
                        <el-select disabled
                                   v-model="scope.row.eventType"
                        >
                          <el-option
                            v-for="item in eventTypes"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                          ></el-option>
                        </el-select>
                      </template>
                    </el-table-column>

                    <el-table-column
                      label="执行方式"
                    >
                      <template slot-scope="scope">
                        <el-select
                          v-model="scope.row.eventWay"
                        >
                          <el-option
                            v-for="item in eventWays"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                          ></el-option>
                        </el-select>
                      </template>
                    </el-table-column>

                    <el-table-column
                      label="执行内容"
                    >
                      <template slot-scope="scope">
                        <el-input v-model="scope.row.eventDoc"></el-input>
                      </template>
                    </el-table-column>
                  </el-table>
                  <el-form
                    label-suffix="："
                    label-width="120px"
                    style="width: 95%"
                  >
                    <el-row>
                      <el-col :span="24">
                        <el-form-item  label="执行说明" prop="overDueWarUrl">
                          <span style="color: darkorange">接口调用方式为POST，参数格式为{"processKey":"流程Key","task_def_key":"节点编号","proce_inst_id":"流程实例ID","businessKey":"业务数据主表id","others":{表单数据JSON}}</span>
                        </el-form-item>
                      </el-col>
                    </el-row>
                  </el-form>
                </el-tab-pane>
              </el-tabs>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane v-for="item in userTasks" :key="item.id" :name="item.id" :label="'节点：'+item.name">
          <el-form
            label-suffix="："
            label-width="90px"
            :model="item.formModel"
            :ref="item.id"
            style="width: 95%"
          >
            <el-row>
              <el-col :span="12">
                <el-form-item label="节点编号" prop="id">
                  <el-input v-model="item.id" readonly></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="节点名称" prop="name">
                  <el-input v-model="item.name"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="驳回规则">
                  <el-select v-model="item.formModel.returnWay">
                    <el-option
                      v-for="(trs, index) in returnWay"
                      :key="index"
                      :label="trs.returnWayName"
                      :value="trs.returnWayKey"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="直接返回" v-if="item.formModel.returnWay == 'allStepsTaken'">
                  <el-form-item>
                    <el-radio-group v-model="item.formModel.runWay">
                      <el-radio label="none">否</el-radio>
                      <el-radio label="directReturn">是</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item>
                          <span style="color: darkorange">
                            如果选择否，流程中存在并发分支的情况下，分支退回时，其他分支任务将会被删除</span>
                  </el-form-item>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="移交">
                  <el-form-item>
                    <el-radio-group v-model="item.formModel.transfer">
                      <el-radio label="0">不启用</el-radio>
                      <el-radio label="1">启用</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="加签">
                  <el-form-item>
                    <el-radio-group
                      v-model="item.formModel.countersign"
                    >
                      <el-radio label="0">不启用</el-radio>
                      <el-radio label="1">启用</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="跳转规则">
                  <el-select v-model="item.formModel.jumpWay" >
                    <el-option
                      v-for="(trs, index) in jumpWay"
                      :key="index"
                      :label="trs.jumpWayName"
                      :value="trs.jumpWayKey"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="手动结束">
                  <el-form-item>
                    <el-radio-group v-model="item.formModel.endTask" >
                      <el-radio label="0">不启用</el-radio>
                      <el-radio label="1">启用</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="拒绝">
                  <el-form-item>
                    <el-radio-group v-model="item.formModel.refuse">
                      <el-radio label="0">不启用</el-radio>
                      <el-radio label="1">启用</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="抄送规则">
                  <el-select v-model="item.formModel.ccWay">
                    <el-option
                      v-for="(trs, index) in ccWay"
                      :key="index"
                      :label="trs.ccName"
                      :value="trs.ccKey"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="抄送设置" v-if="item.formModel.ccWay == 'autoCC'">
                  <el-select v-model="item.formModel.autoCCWay">
                    <el-option
                      v-for="(trs, index) in autoCCWay"
                      :key="index"
                      :label="trs.autoCCName"
                      :value="trs.autoCCKey"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <div class="theme-main-container">
            <div class="filter-container">
              <el-tabs v-model="taskActiveTabs" type="card">
                <el-tab-pane label="事件管理" name="1">

                  <el-table
                    :data="item.eventClass"
                    class="table1"
                  >
                    <el-table-column
                      type="index"
                      label="序号"
                      width="50"
                    > </el-table-column>

                    <el-table-column
                      label="事件类型"
                    >
                      <template slot-scope="scope">
                        <el-select disabled
                                   v-model="scope.row.eventType"
                        >
                          <el-option
                            v-for="e in taskEventTypes"
                            :key="e.value"
                            :label="e.label"
                            :value="e.value"
                          ></el-option>
                        </el-select>
                      </template>
                    </el-table-column>

                    <el-table-column
                      label="执行方式"
                    >
                      <template slot-scope="scope">
                        <el-select
                          v-model="scope.row.eventWay"
                        >
                          <el-option
                            v-for="e in eventWays"
                            :key="e.value"
                            :label="e.label"
                            :value="e.value"
                          ></el-option>
                        </el-select>
                      </template>
                    </el-table-column>

                    <el-table-column
                      label="执行内容"
                    >
                      <template slot-scope="scope">
                        <el-input v-model="scope.row.eventDoc"></el-input>
                      </template>
                    </el-table-column>
                  </el-table>
                  <el-form
                    label-suffix="："
                    label-width="120px"
                    style="width: 95%"
                  >
                    <el-row>
                      <el-col :span="24">
                        <el-form-item  label="执行说明" prop="overDueWarUrl">
                          <span style="color: darkorange">接口调用方式为POST，参数格式为{"processKey":"流程Key","task_def_key":"节点编号","proce_inst_id":"流程实例ID","businessKey":"业务数据主表id","others":{表单数据JSON}}</span>
                        </el-form-item>
                      </el-col>
                    </el-row>
                  </el-form>
                </el-tab-pane>
                <el-tab-pane label="逾期设置" name="2">
                  <el-form
                    label-suffix="："
                    label-width="120px"
                    :model="item.ruleOverDue"
                    :ref="item.id+'ruleOverDue'"
                    style="width: 95%"
                  >
                    <el-row>
                      <el-col :span="12">
                        <el-form-item label="生命周期(D)" prop="actionCycle">
                          <el-input v-model="item.ruleOverDue.actionCycle"
                                    @input.native="formatNumber('actionCycle','ruleOverDue')"
                                    @compositionend.native="formatNumber('actionCycle','ruleOverDue')"></el-input>
                        </el-form-item>
                      </el-col>
                      <el-col :span="12">
                        <el-form-item label="预警时间(H)" prop="beforeTime">
                          <el-input v-model="item.ruleOverDue.beforeTime"
                                    @input.native="formatNumber('beforeTime','ruleOverDue')"
                                    @compositionend.native="formatNumber('beforeTime','ruleOverDue')"></el-input>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <el-row>
                      <el-col :span="12">
                        <el-form-item label="逾期预警" prop="overDueWar">
                          <el-select
                            v-model="item.ruleOverDue.overDueWar"
                          >
                            <el-option
                              v-for="item in overDueWarnings"
                              :key="item.value"
                              :label="item.label"
                              :value="item.value"
                            ></el-option>
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <el-col :span="12">
                        <el-form-item v-if="item.ruleOverDue.overDueWar==2" label="预警接口" prop="overDueWarUrl">
                          <el-input v-model="item.ruleOverDue.overDueWarUrl"></el-input>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <el-row>
                      <el-col :span="12">
                        <el-form-item label="逾期处理" prop="overDueWay">
                          <el-select
                            v-model="item.ruleOverDue.overDueWay"
                          >
                            <el-option
                              v-for="item in overDueWays"
                              :key="item.value"
                              :label="item.label"
                              :value="item.value"
                            ></el-option>
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <el-col :span="12">
                        <el-form-item v-if="item.ruleOverDue.overDueWay==3" label="逾期接口" prop="overDueWayUrl">
                          <el-input v-model="item.ruleOverDue.overDueWayUrl"></el-input>
                        </el-form-item>
                      </el-col>
                    </el-row>
                  </el-form>
                </el-tab-pane>
              </el-tabs>
            </div>
          </div>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script>
import { flowSortTree } from '@/api/process/flowsort';
import {
  processList,
  updataProcess,
  getFormElement,
  delDefinition
} from '@/api/process/flowdesign';
import {mapGetters} from "vuex";
export default {
  name: "processActive",
  props:['ruleForm','formMapList','sortdata'],
  components: {  },
  data(){
    return {
      autoCCWayVisible:false,
      returnWay: [],
      jumpWay:[],
      ccWay:[],
      autoCCWay:[],
      taskFormtype: '',
      proceActiveName: 'first',
      taskActiveTabs:'1',
      subActiveName:'1',
      mapJson: '',
      userTasks:[],
      title: '',
      tabList: [],
      activeName: '',
      proceParams:[

      ],
      proceCheckedDetail: [],
      ruleOverDue:{
        actionCycle:'',
        beforeTime:'',
        overDueWar:'0',
        overDueWarUrl:'',
        overDueWay:'0',
        overDueWayUrl:''
      },
      timedStart:{
        tstWay:'0',
        tstDoc:'',
        userSql:''
      },
      eventClass:[],
    }
  },
  created() {
    this.returnWay=this.getReturnWay;
    this.jumpWay=this.getJumpWay;
    this.ccWay=this.getCCWay;
    this.autoCCWay=this.getAutoCCWay;
  },
  computed: {
    ...mapGetters('store/taskRule', [
      'getReturnWay',
      'getJumpWay',
      'getCCWay',
      'getAutoCCWay'
    ]),
    ...mapGetters('store/processevent',[
      'eventTypes',
      'taskEventTypes',
      'eventWays'
    ]),
    ...mapGetters('store/processparams',[
      'paramTypes',
      'paramValueTypes',
      'overDueWarnings',
      'overDueWays',
      'timedStartWays'
    ])
  },
  methods:{
    //类型选择
    async getSelectData() {
      const data = (await flowSortTree()).result;
      if (data.length) {
        this.tabList = data;
        this.activeName = this.tabList[0].id + '';
      }
    },
    //表单类型联动
    updateProceForm(key) {
      if(key=="form_type"){
        this.taskFormtype=this.ruleForm[key];
        return;
      }
      if(key=="form_url"){
        this.taskFormtype=this.ruleForm[key];
        return;
      }
    },
    //保存编辑
    saveEdit() {
      this.ruleForm.sortid = this.value;
      let processDefinitionParams= {
        id:this.ruleForm.id,
        name:this.ruleForm.name,
        key:this.ruleForm.key,
        sortid:this.ruleForm.sortid,
        form_type:this.ruleForm.form_type,
        formMap:this.ruleForm.formMap,
        form_url:this.ruleForm.form_url,
        titleModel:this.ruleForm.titleModel,
        proceParams:this.proceParams,
        ruleOverDue:this.ruleOverDue,
        timedStart:this.timedStart,
        eventClass:this.eventClass,
        userTasks:this.userTasks
      };

      updataProcess(processDefinitionParams).then((res) => {
        if (res.error == '200') {
          this.$message.success('修改成功');
          this.dialogNewSortVisible = false;
          setTimeout(() => {
            this.deploy();
          }, 1000);
        } else {
          this.$message.error('获取失败');
        }
      });
    },
    //业务编辑
    editSort(deploymentId, name, key,sortid, processkey) {
      this.title = '业务配置';
      this.ruleForm.name = name;
      this.ruleForm.key=key;
      this.ruleForm.id = deploymentId;
      this.ruleForm.process_key = processkey;
      if (sortid == 0 || sortid == null) {
        this.ruleForm.sortid = null;
        this.value = null;
      } else {
        let newSortId = sortid - 0;
        this.ruleForm.sortid = newSortId;
        this.value = newSortId;
      }
      //获取流程参数
      getFormElement({ process_key: processkey }).then((res) => {
        if (res.error != '200') {
          this.mapJson = '';
          this.ruleForm.form_type = '';
          this.ruleForm.formMap = '';
          this.ruleForm.form_url = '';
          this.taskFormtype = '';
          this.dialogNewSortVisible = true;
          return;
        } else {
          if (res.result == '' || res.result == undefined) {
            this.mapJson = '';
            this.ruleForm.form_type = '';
            this.ruleForm.formMap = '';
            this.ruleForm.form_url = '';
            this.taskFormtype = '';
            this.dialogNewSortVisible = true;
            return;
          }
          if (res.result.flowElementAttrs.mapJson == '' || res.result.flowElementAttrs.mapJson == undefined) {
            this.mapJson = '';
          } else {
            this.mapJson = JSON.parse(res.result.flowElementAttrs.mapJson);
          }
          this.ruleForm.form_type = res.result.flowElementAttrs.form_type;
          this.ruleForm.formMap = res.result.flowElementAttrs.formMap;
          this.ruleForm.form_url = res.result.flowElementAttrs.form_url;
          this.ruleForm.titleModel=res.result.flowElementAttrs.titleModel;
          this.taskFormtype = res.result.flowElementAttrs.form_type;
          this.userTasks=res.result.userTasks;
          this.eventClass=res.result.eventClass;
          this.proceParams=res.result.proceParams;
          this.timedStart=res.result.timedStart;
          this.ruleOverDue=res.result.ruleOverDue;
          this.dialogNewSortVisible = true;
        }
      });
    },
    //设置表单预览参数
    updateAttrs() {
      let selectOption = this.formMapList.filter((item) => {
        if (item.id == this.ruleForm.formMap) {
          return item;
        }
      });
      if (selectOption[0].form_json == undefined) {
        this.mapJson = undefined;
        return;
      }
      this.mapJson = JSON.parse(selectOption[0].form_json);
    },
    //限制只能输入数字
    formatNumber(field,fieldModel) {
      if(fieldModel=="ruleForm") {
        this.ruleForm[field] = this.ruleForm[field].toString().replace(/[^\d]/g, "");
      }
      if(fieldModel=="ruleOverDue") {
        this.ruleOverDue[field] = this.ruleOverDue[field].toString().replace(/[^\d]/g, "");
      }
    },
    //添加流程参数行
    addtable() {
      if (this.proceParams == undefined) {
        this.proceParams = new Array();
      }
      let obj = {
        paramKey: '',
        paramType: null,
        paramValue: '',
        valueType:'0'
      };

      this.proceParams.push(obj);
    },
    //清空参数列表
    qingchutable() {
      this.proceParams = [];
    },
    //删除选中的参数
    deltable() {
      if (this.proceCheckedDetail.length == 0) {
        this.$alert("请先选择要删除的数据", "提示", {
          confirmButtonText: "确定",
        });
      } else {
        this.proceParams.splice(this.proceCheckedDetail[0].index - 1, 1);
      }
    },
    //动态生成参数列表的index
    rowClassName({ row, rowIndex }) {
      row.index = rowIndex + 1;
    },
    //选中参数行
    handleDetailSelectionChange(selection) {
      if (selection.length > 1) {         //删除一行
        this.$refs.proceParamsTable.clearSelection();//清空用户的选择
        this.$refs.proceParamsTable.toggleRowSelection(selection.pop());//切换某一行的选中状态
      } else {
        this.proceCheckedDetail = selection;
      }
    },

    openAutoCCWayForm() {
      // if (listener) {
      //   this.editingCCWayIndex = index;
      // } else {
      //   this.editingCCWayIndex = -1; // 标记为新增
      // }
      // 打开侧边栏并清除验证状态
      this.autoCCWayVisible = true;
    }
  }
}
</script>

<style scoped>

</style>
